<template>
	<view>
		<view class="listbox" v-for="(item,index) in list" :key="index">
			<view class="timebox">{{item.create_time|dateFormat}}</view>
			<view v-if="item.is_cz==1">￥<text style="font-size: 34rpx;">{{item.money}}</text>话费</view>
			<!-- <view class="label">未充值</view> -->
			<view v-else class="label isRecharge">已充值</view>
		</view>
		<view class="kongbox" v-if="list.length==0">
			<image src="../../static/kong.png"></image>
			<view>暂无</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				list:[],
				page:1,
				is_dataone:true,
			}
		},
		filters:{
		            //过滤器 用于格式化时间
		            dateFormat: function(value) {           
		                var date = new Date(value*1000); //时间戳为10位需*1000，时间戳为13位的话不需乘1000
		                var year = date.getFullYear();
		                var month = ("0" + (date.getMonth() + 1)).slice(-2);
		                var sdate = ("0" + date.getDate()).slice(-2);
		                var hour = ("0" + date.getHours()).slice(-2);
		                var minute = ("0" + date.getMinutes()).slice(-2);
		                var second = ("0" + date.getSeconds()).slice(-2);
		                // 拼接
		                var result = year + "-" + month + "-" + sdate + " " + hour + ":" + minute //+ ":" + second;
		                // 返回
		                return result;
		            },
		        },
		onLoad() {
			this.getlist()
		},
		onReachBottom() {
			this.is_dataone&&this.getlist()
		},
		methods: {
			getlist(){
				uni.showLoading({})
				this.$http({
					url:'api/Answer/user_prize_log',
					data:{
						token:uni.getStorageSync('token'),
						page:this.page,
						limit:10
					}
				}).then(res=>{
					uni.hideLoading()
					if(res.data.length){
						this.list.push(...res.data)
						this.page++
						return
					} 
					this.is_dataone = false
				})
			},
			
		}
	}
</script>

<style>
	page{
		background-color: #F4F9FD;
	}
</style>
<style lang="scss" scoped>
	.listbox{
		width: 620rpx;
		height: 98rpx;
		// background: #FFFFFF;
		background: linear-gradient(90deg, #CAE4FF, #FFFFFF);
		border-radius: 10rpx;
		margin: 30rpx auto 0 auto;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding: 0 25rpx;
		font-size: 26rpx;
		font-family: Source Han Sans CN;
		font-weight: 400;
		color: #222222;
		.timebox{
			font-size: 28rpx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #555555;
		}
	}
	.kongbox{
		margin: 0 auto;
		font-size: 36rpx;
		font-family: Source Han Sans CN;
		font-weight: bold;
		color: #666666;
		text-align: center;
		image{
			width: 500rpx;
			height: 500rpx;
			margin-top: 80rpx;
		}
	}
	.label{
		background-color: #e4e4e4;
		border-radius: 10rpx;
		padding: 10rpx 20rpx;
		zoom: .8;
	}
	.isRecharge{
		background-color: #409eff;
		color: white;
	}

</style>
